<template>
	<view >
	<uni-nav-bar
	left-icon="back" 
	status-bar=true
	fixed=true
	color="#fff"
	left-text="返回" 
	right-text="" 
	title="中奖详情"
	background-color="#37c0b9"
	@clickLeft="toback"
	></uni-nav-bar>
	
	<view class="main">
		<view class="touxiang">
			<image :src="userImg" mode="widthFix"></image>
		</view>
		<view class="title" v-if="is_id==2">
			恭喜您挑战成功
			
		</view>
		<view class="fail" v-else>
			您挑战失败
		</view>
		
	</view>
	</view>
</template>

<script>
	import api from '@/pages/utils/api.js';
	export default {
		data() { 
			return {
				userImg: "/static/imgs/moren.jpg",
				page_id:'',
				is_id:''
				
			}
		},
		onLoad(option) {
			this.page_id=option.id
			console.log(this.page_id)
			let a = uni.getStorageSync("token");
			if (!a) {
				uni.showModal({
					title: '提示',
					content: '请登录',
					success: function(res) {
						if (res.confirm) {
							uni.navigateTo({
								url: "../login-app/login-app"
							})
						} else if (res.cancel) {
							uni.switchTab({
								url: '/pages/index/index'
							});
						}
					}
				});
			}
			// 获取用户头像和姓名
			let vm = this;
			api.getMemberInfo({}).then((res) => {
				if(res.data.avatar){
					vm.userImg = res.data.avatar 
				}
			});
			//获取成功失败
			api.getAnswerLogDetail({
				log_id:this.page_id
			}).then(res=>{
				console.log(res)
				this.is_id=res.data.is_success
				console.log(this.is_id)
				
			})
			
		},
		methods: {
			toback:function(){
				uni.navigateBack({
				    delta: 1,
				    animationType: 'pop-out',
				    animationDuration: 200
				}); 
			}
			
		}
	}
</script>

<style>
	body{
		
		background: url(../../../static/imgs/dtbg.jpg)no-repeat;
		background-size:cover;
		background-attachment:fixed;
		
	}
	.main{
		width: 500rpx;
		height: 500rpx;
		background-color: #FFFFFF;
		box-shadow: 0px 0px 10px  #ccc;
		margin: 0 auto;
		margin-top: 200rpx;
		position: relative;
	border-radius: 30rpx;
	}
	.touxiang{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 150rpx;
		height: 150rpx;
		margin: 0 auto;
		border: 1px solid #e0e0e0;
		border-radius: 80rpx;
		position: absolute;
		top: -75rpx;
		left: 180rpx;
		background-color: #FFFFFF;
		z-index: 900;
		overflow: hidden;
		
	}
	.touxiang image{
		width: 100%;
	}
	.title{
		padding-top: 200rpx;
		font-size: 50rpx;
		text-align: center;
		color: #339443;
		}
		.fail{
			padding-top: 200rpx;
			font-size: 50rpx;
			text-align: center;
			color: #aa0000;
			
		}
		
	.time{
		color:#ccc;
		font-size: 35rpx;
		margin-top: 30rpx;
		text-align: center;
	}	
	.score{
		color:#ccc;
		font-size: 35rpx;
		margin-top: 10rpx;
		text-align: center;
	}	
	

</style>
